<template>
  <div>
    <div class="video-box">
      <video
        id="myVideo"
        src="https://outin-fbc8756bdadc11eaaaef00163e1a3b4a.oss-cn-shanghai.aliyuncs.com/sv/1a738487-1780b987691/1a738487-1780b987691.mp4?Expires=1615105846&OSSAccessKeyId=LTAIxSaOfEzCnBOj&Signature=n9HL5pVdSHAWkwH%2B8mgmnUj3Edc%3D"
        :danmu-list="danmuList"
        enable-danmu
        danmu-btn
        controls
      />
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      videoContext: wx.createVideoContext("myVideo"),
      danmuList: [
        {
          text: "真不错",
          color: "#ff0000",
          time: 1,
        },
        {
          text: "英语课真不错",
          color: "#ff00ff",
          time: 3,
        },
        {
          text: "还行",
          color: "#ff00ff",
          time: 12,
        },
        {
          text: "我的英语有救了",
          color: "#ff00ff",
          time: 15,
        },
      ],
    };
  },
};
</script>

<style>
.video-box{
  width: 100%;
  height: 100%;
  text-align: center;
  margin-top: 30%;
}
</style>
